<script setup>
import {RouterLink, RouterView} from 'vue-router'
import {useCounterStore} from '@/stores/counter.js'

const counterStore = useCounterStore()
const index = 0
const children = counterStore.list[index].children
const text = counterStore.list[index].text
</script>
<template>
  <div class="title_top">
    <span>
      {{ text }} /
    </span>
    <span v-for="item in children">
      <span v-if="item.name===$route.name">
        {{ item.text }}
      </span>
    </span>
  </div>
  <div class="blank">
    <div class="card">
      <div class="card_item" v-for="item in children">
        <router-link :to="{name:item.name}" class="card_item_a">
          {{ item.text }}
        </router-link>
      </div>
    </div>
    <div class="card_main">
      <router-view :value="index"></router-view>
    </div>
  </div>
</template>
<style scoped>
@import "../assets/blank.css";
</style>